<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<link href="<c:url value="/css/style.css" />" rel="stylesheet" type="text/css" media="screen" />
		<script src="<c:url value="/js/jquery-1.9.1.min.js" />"></script>
		<title>Insert title here</title>
		<style>
			#page1 {
				width: 1050px;
				background: #FFFACD;
				border-radius: 45px;
				-moz-border-radius: 45px;
				-webkit-border-radius: 45px;
				margin: 0 auto;
				padding: 0;
				border-width: rough;
				border-style: dashed;
				border-color: #FFFF00;
			}

			.rosy {
				color: #fae7e9;
				border: solid 1px #b73948;
				background: #da5867;
				background: -webkit-gradient(linear, left top, left bottom, from(#f16c7c), to(#bf404f));
				background: -moz-linear-gradient(top,  #f16c7c,  #bf404f);
				filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f16c7c', endColorstr='#bf404f');
			}
			.rosy:hover {
				background: #ba4b58;
				background: -webkit-gradient(linear, left top, left bottom, from(#cf5d6a), to(#a53845));
				background: -moz-linear-gradient(top,  #cf5d6a,  #a53845);
				filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cf5d6a', endColorstr='#a53845');
			}
			.rosy:active {
				color: #dca4ab;
				background: -webkit-gradient(linear, left top, left bottom, from(#bf404f), to(#f16c7c));
				background: -moz-linear-gradient(top,  #bf404f,  #f16c7c);
				filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#bf404f', endColorstr='#f16c7c');
			}

			#left {

				width: 1000px;
			}
			#right {

				width: 1000px;
			}
			#memberindexcenter {
				width: 1000px;
				margin: auto;
			}

			.content_box {
				width: 157px;
				height: 200px;
				display: inline-block;
				font-size: 12px;
				border: 3px dashed #FF3937;
				padding: 10px;
				margin: 5px 5px 5px 0;
				overflow: hidden;
				font-size: 16px;
				line-height: 1.5em;
				letter-spacing: 1pt;
				-webkit-border-radius: 5px;
				-moz-border-radius: 5px;
				border-radius: 5px;
			}
		</style>

	</head>
	<body>
		<!-- 引入共同的頁首 -->
		<c:set var="funcName" value="IND" scope="session"/>
		<jsp:include page="/top/top.jsp" />

		<!-- 從這裡開始寫 -->
		<div id="page1">
			<div id="memberindexcenter">

				<div id="left" align=center>
					<br />
					<table>
						<tr>
							<td> <%-- <img src="<c:url value="/images/pee.jpg" />" > --%> <img height='120' width='120' src='${pageContext.servletContext.contextPath}/getImg?id=${his.mbid}&type=MEMBER' ></td>
							<td>
							<form action="<c:url value="/member/OrderServlet" />">
								<input type="hidden" name="hismbid" value="${his.mbid}">
								<input id="t5divleft4" class="button rosy" type="submit" value="訂閱" />
							</form></td>
						</tr>

					</table>
				</div>

				<div id="right" align=center>
					<br />
					<h3><font size="5px" color="#00A002" style="font-weight:bold;">${his.mbname}分享的食譜</font></h3>
					<br />
					<center>
						<table style="width:950px" align=center>
							<% int i=0; %>
							<tr>
								<c:forEach varStatus="stVar"  var="rbean"  items="${mbRecipe}" >

									<TD class="content_box">
									<center>
										<a href="<c:url value='/recipe/ShowRecipe?rid=${rbean.rid}' />"> <img height='100' width='100' src='${pageContext.servletContext.contextPath}/getImg?id=${rbean.rid}&type=RECIPE'>
										<br/>
										${rbean.rname} </a>
										<br/>
										<b><font style=font-size:0.3cm>分享日期:${rbean.rdate}</font></b>

									</center></TD>
									<% i++;
									if(i%5==0){
									out.print("</tr> <tr>");}
								    %>

								</c:forEach>
							</tr>
						</table>
					</center>
				</div>
				<div style="clear: both;">
					&nbsp;
				</div>

			</div>
		</div>
		<c:if test="${not empty success }">
			<script type="text/javascript">
				$(function() {
					alert("訂閱作者成功!!");
				})
			</script>
		</c:if>

		<c:if test="${not empty fail }">
			<script type="text/javascript">
				$(function() {
					alert("您已經訂閱過此作者!!");
				})
			</script>
		</c:if>

		<!-- 寫到這裡結束 -->

		<div id="footer-wrapper">
			<div id="footer">
				<p>
					Copyright (c) 2010 Sitename.com. All rights reserved. Design by <a href="http://www.freecsstemplates.org/" rel="nofollow">FCT</a>.
				</p>
			</div>
		</div>
	</body>
</html>